<template>
    <div class="message">
        <gltitle :titleSize="titleSize" :is_mt="is_mt" v-if="!$store.state.isApp"></gltitle>
        <div class="message-con">
            <van-list v-model="loading" :finished="finished" :loading-text="$t('load.loading')" @load="onLoad">
                <van-cell v-for="item in list" :key="item.id">
                <div class="info" @click="handlerInfo(item)">
                    <div class="info-top">
                        <div>{{item.title}}</div>
                        <p>{{item.date}}</p>
                    </div>
                    <div class="info-desc">{{item.content}}</div>
                </div>
                </van-cell>
            </van-list>

        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            titleSize: '',
            is_mt: true,
            list: [],
            loading: false,
            finished: false,
            page: 1,
            totals:0
        }
    },
    created() {
        
        document.title = this.$route.query.name;
        localStorage.removeItem('messageinfo')
    },
    methods: {
        handlerInfo(item) {
            if(item.forwardPath=='WALLET_HOME'){
                this.$router.push('/user/wallet')
            }else if(item.forwardPath == 1){
                localStorage.setItem('messageinfo',JSON.stringify(item))
                this.$router.push(`/messageinfo`)
            }
        },  
        onLoad() {
            setTimeout(() => {
                this.$post(this.URL.member.messageList, {
                    groupKey: this.$route.query.type,
                    page: this.page,
                    pageSize: 10
                }).then(res => {
                    if (res.code == 0) {
                        this.list = this.list.concat(res.data.list);
                        this.page++;
                        this.loading = false;
                        if(this.$route.query.type !='SYSTEM'){
                        this.titleSize = this.$route.query.name+`(${res.data.page.count})`;
                        }
                        if (this.list.length >= parseFloat(res.data.page.count)) {
                            this.finished = true;
                        }
                    }
                })
            }, 500);
        }
    }
}
</script>

<style lang="less" scoped>
.message {
    min-height: 100vh;
    background: #F7F7FA;

    .message-con {
        padding: .88rem 0 0;
        /deep/ .van-cell {
            padding: 0;
            &::after{
                border-bottom: 0;
            }
        }
        .info{
            padding: .38rem .32rem;
            border-bottom: .2rem solid #F7F7FA;
            .info-top{
                display: flex;
                justify-content: space-between;
                font-size: .22rem;
                color: #999999;
                line-height: .34rem;
                div{
                    font-size: .28rem;
                    color: #222222;
                }
            }
            .info-desc{
                margin-top: .18rem;
                font-size: .26rem;
                color: #666666;
                line-height: .34rem;
            }
        }
    }

}
</style>